﻿@using Smartstore.Web.Models.Catalog;

@model ProductReviewsModel

<script src="~/js/public.reviews.js" sm-target-zone="scripts"></script>

@{
    if (Model.Items.Count == 0)
    {
        <p class="text-muted">@T("Reviews.Empty")</p>
        return;
    }

    var res = new Dictionary<string, LocalizedString>
    {
        ["WasHelpful"] = T("Reviews.Helpfulness.WasHelpful?"),
        ["Helpful"] = T("Common.Helpful"),
        ["NotHelpful"] = T("Common.NotHelpful"),
        ["Yes"] = T("Common.Yes"),
        ["No"] = T("Common.No"),
        ["Date"] = T("Common.Date"),
        ["Count"] = T("Common.Count"),
        ["Verified"] = T("Reviews.Verified"),
        ["Unverified"] = T("Reviews.Unverified"),
        ["From"] = T("Reviews.From")
    };
}

<div class="review-list fs-h6" id="review-list">
    @for (var i = 0; i < Model.Items.Count; i++)
    {
        var review = Model.Items[i];
        int ratingPercent = review.Rating * 20;
        var helpfulness = review.Helpfulness;
        var id = i + 1;

        <div id="review-item-@id"
             class="review-item"
             role="article"
             aria-labelledby="review-title-@id"
             itemscope
             attr-itemprop='(!Model.IsReviewsDetailPage, "review")'
             attr-itemtype='(!Model.IsReviewsDetailPage, "http://schema.org/Review")'>
            <div class="review-title">
                <div role="img" 
                     class="rating" 
                     itemprop="reviewRating" 
                     itemscope 
                     itemtype="https://schema.org/Rating" 
                     aria-label="@T("Aria.Label.Rating", @review.Rating, string.Empty)">
                    <div style="width: @(ratingPercent)%"></div>
                    <meta itemprop="ratingValue" content="@review.Rating" />
                </div>
                <h4 id="review-title-@id" itemprop="name">@review.Title</h4>
            </div>

            <div class="review-meta">
                <span sm-if="review.CustomerName.HasValue()" itemprop="author" itemscope itemtype="https://schema.org/Person">
                    <span class="review-meta-label">@res["From"]:</span>
                    @if (review.AllowViewingProfiles)
                    {
                        <a class="review-meta-value" asp-route="CustomerProfile" asp-route-id="@review.CustomerId" rel="nofollow" dir="auto" itemprop="name">
                            <span class="sr-only">@(res["From"])&nbsp;</span>
                            <span>@review.CustomerName</span>
                        </a>
                    }
                    else
                    {
                        <span class="review-meta-value" itemprop="name">@review.CustomerName</span>
                    }
                </span>

                <span class="review-meta-label d-flex align-self-start">@res["Date"]:</span>
                <time class="review-meta-value d-flex align-self-start text-nowrap" itemprop="datePublished" datetime="@review.WrittenOn.ToIso8601String()">
                    @review.WrittenOnStr
                </time>
            </div>

            <div sm-if="Model.ShowVerfiedPurchaseBadge" class="review-verify">
                <span class="small badge badge-@(review.IsVerifiedPurchase ? "success" : "secondary")">
                    @res[review.IsVerifiedPurchase ? "Verified" : "Unverified"]
                </span>
            </div>

            <p class="review-text" dir="auto" itemprop="reviewBody">
                @Html.Raw(review.ReviewText)
            </p>

            <div class="review-vote d-flex" 
                 data-review-id="@(helpfulness.ProductReviewId)" 
                 data-href="@(Url.Action("SetReviewHelpfulness"))"
                 role="group"
                 aria-labelledby="sr-review-washelpful-@id">
                <span id="sr-review-washelpful-@id" class="review-vote-label pr-2">@res["WasHelpful"]</span>
                <button type="button" class="reset review-vote-link review-vote-link-yes mr-1" title="@res["Yes"]" data-toggle="tooltip" aria-describedby="review-yes-count-@id">
                    <i class="fa fa-thumbs-up" aria-hidden="true"></i>
                    <span class="sr-only">@res["Yes"] - @res["Helpful"]</span>
                    <span id="review-yes-count-@id" class="review-vote-count" data-bind-to="TotalYes" aria-label="@res["Count"]">@(helpfulness.HelpfulYesTotal)</span>
                </button>
                <button type="button" class="reset review-vote-link review-vote-link-no mr-1" title="@res["No"]" data-toggle="tooltip" aria-describedby="review-no-count-@id">
                    <i class="fa fa-thumbs-down" aria-hidden="true"></i>
                    <span class="sr-only">@res["No"] - @res["NotHelpful"]</span>
                    <span id="review-no-count-@id" class="review-vote-count" data-bind-to="TotalNo">@(helpfulness.HelpfulNoTotal)</span>
                </button>
            </div>

            <zone name="productreviews_page_inside_review" />
        </div>
    }
</div>

<div sm-if="Model.TotalReviewsCount > Model.Items.Count" class="text-center">
    <a class="btn btn-secondary" asp-action="Reviews" asp-route-id="@Model.ProductId" asp-fragment="review-item-11">
        <span>@T("Reviews.Overview.ReadAll")</span>
    </a>
</div>